{% extends 'layout.html' %}
{% load static %}
{% block css %}
<link rel="stylesheet" href="{% static 'css/light_novel_show.css' %}">
{% endblock %}
{% block content %}
    <div class="hotsearch-container">
        <h1 class="hotsearch-title">～(∠・ω・ )⌒☆轻小说</h1>
        <!-- 模拟热搜排名项 -->
        {% for obj in show_novel %}
        <div class="hotsearch-item">
            <div class="hotsearch-image-placeholder"><img src="{% static '/picture/qxszs.jpeg' %}"></div>
            <div class="hotsearch-details">
                <a href="/novel/{{ obj.id }}/read/" class="hotsearch-biaoti">{{ obj.title }}</a>
                <div class="hotsearch-meta">
                    <span class="hotsearch-rank">排名: {{ forloop.counter }}</span>
                    <span class="hotsearch-date">发行日期: {{obj.release_time|date:"Y-m-d" }}</span>
                    <span class="hotsearch-views">喜欢: {{ obj.likes }}</span>
                </div>
            </div>
            <div class="hotsearch-popularity">
                <span class="flame-icon">🔥评分: {{ obj.score }}</span>
            </div>
        </div>
    {% endfor %}
    </div>
{% endblock %}